{include file='fcworker/fc_userdata_head'}
	<style>
		.fllowSearch .my-layui-form {
			float: left;
			width: 1.8rem;
			height: .62rem;
			background: #f3f3f3;
			border-radius: .62rem;
			margin-left: .05rem;
		}

		.fllowSearch .layui-inline {
			height: 100%;
		}
		.fllowSearch .layui-form-select {
			height: 100%;
		}
		.fllowSearch .layui-select-title {
			height: 100%;
		}
		.fllowSearch .layui-form-select .layui-input {
			background: transparent;
			border: none;
			height: 100%;
			color: #353535;
		}
		.fllowSearch .layui-form .layui-form-select dl dd.layui-this {
			background-color: #70b6f7;
		}
	</style>
<div id="mescroll" class="mescroll">
	<div id="app">
		<div class="fixTop">
			<div class="journalTitle">
				<a href="/{php echo createMobileUrl('main',array('themeid'=>$themeid,'mod'=> 'userdata','op' => 'log_list'));}" >日志</a>
				<a href="/{php echo createMobileUrl('main',array('themeid'=>$themeid,'mod'=> 'userdata','op' => 'focuse_list'));}">关注</a>
				<a class="cur"  href="/{php echo createMobileUrl('main',array('themeid'=>$themeid,'mod'=> 'userdata','op' => 'trace_list'));}">追踪</a>
			</div>
			<div class="journalTitle">

			</div>
			<div class="fllowSearch" style="padding:.26rem .2rem .26rem .2rem">
				<form class="layui-form">
					<div class="my-layui-form">
						<select id="trace_type" name="trace_type" lay-filter="trace_type">
							<option value="1">未付款</option>
							<option value="2">已付款</option>
							<option value="3">未追踪</option>
							<option value="4">已追踪</option>
							<option value="5">意向</option>
							<option value="6">潜在</option>
							<option value="7">无意向</option>
							<option value="8">待回访</option>
						</select>
					</div>
					{if $level<3}
					<div class="my-layui-form">
						<select id="select_workerid" name="select_workerid" lay-filter="select_workerid">
							<option value="0">所有员工</option>
							{loop $worker_list $row}
							<option  value="{$row['uid']}" >{$row['username']}</option>
							{/loop}
						</select>
					</div>
					{/if}
				</form>
				<input style="margin-left: .1rem" type="text" id="keyword" name="keyword" value="{$keyword}" placeholder="输入关键字"/>
				<button type="button" id="search_btn">搜索</button>
			</div>
		</div>
		<div class="h203">

		</div>
		<div class="floowList">
			<ul id="newsList"  class="news-list">

			</ul>
		</div>
	</div>
	<input type="hidden" name="page" id="page" value="1">
	<input type="hidden" name="op" id="op" value="trace_list">
	<input type="hidden" name="hasNext" id="hasNext" value="{$hasNext}">
	<div style="height: 1.1rem;"></div>
	</div>
</div>

 </body>
 <script type="text/javascript">
	 const mescroll = new MeScroll("mescroll", {
		 down: {
			 auto: false,
			 callback: () => {
				 mescroll.endSuccess();
				 getData(1,() => {
					 mescroll.endSuccess()
				 },true)
			 }
		 },
		 up: {
			 use: true,
			 auto: false,
			 isBounce: false,
			 callback: (page) => {
				 let pageNum = Number($("#page").val())+1;
				 getData(pageNum, (curPageData, hasNext) => {
					 mescroll.endSuccess(curPageData, hasNext);
				 });
			 }
		 }
	 })
	 // if(!$("#hasNext").val()) {
		//  mescroll.lockUpScroll(true);
	 // }
	 var loadingState= false;
	 var hasNext = 1;
	 layui.use('form', function(){
		 const form = layui.form;
		 var op = $('#op').val();
		 var trace_type = {php echo $trace_type?$trace_type:1;};
		 form.on('select(trace_type)', function (data) {
			 sessionStorage.removeItem('fllow_page_list');
			 sessionStorage.removeItem('fllow_offset_top');
			 location.href =  `/{php echo createMobileUrl('main',array('themeid'=>$themeid,'mod'=>'userdata'));}&op=${op}&trace_type=${data.value}`;
		 })
		 $('#trace_type').val(trace_type);

		 var select_workerid = {php echo $select_workerid?$select_workerid:0;};
		 form.on('select(select_workerid)', function (data) {
			 sessionStorage.removeItem('fllow_page_list');
			 sessionStorage.removeItem('fllow_offset_top');
			 location.href =  `/{php echo createMobileUrl('main',array('themeid'=>$themeid,'mod'=>'userdata'));}&op=${op}&select_workerid=${data.value}`;
		 })
		 $('#select_workerid').val(select_workerid);
		 form.render();
	 });

	 $('#trace_type').click(function (){
		 var op = $('#op').val();
		 sessionStorage.removeItem('fllow_page_list');
		 sessionStorage.removeItem('fllow_offset_top');
		 location.href = "/{php echo createMobileUrl('main',array('themeid'=>$themeid,'mod'=> 'userdata','wait_trace' => 1));}&op="+op;
	 })

	 $('#search_btn').click(function(){
		 var op = $('#op').val();
		 sessionStorage.removeItem('fllow_page_list');
		 sessionStorage.removeItem('fllow_offset_top');
		 var workerid = {php echo $workerid ? $workerid : 0;};
		 var keyword = $('#keyword').val();
		 location.href = "/{php echo createMobileUrl('main',array('themeid'=>$themeid,'mod'=> 'userdata'));}&op="+op+"&workerid="+workerid+"&keyword="+keyword;
	 })

	 $('#newsList').on('click','.controlBar > i',function(event){
		 event.stopPropagation();
		 $(".controlList").hide();
		 if ($(this).prev().is(':hidden')) {
			 $(this).prev().show();
		 }else{
			 $(this).prev().hide();
		 }
	 });

	 $(document).on("click",function(){
		 $(".controlList").hide();
	 });

	 function openAll(that){
		 $(that).siblings().children('dt').show();
		 $(that).hide();
	 }

	 $('#mescroll').scroll(function() {
		 const scrollSpace = $(this).scrollTop()
		 sessionStorage.setItem("fllow_offset_top",scrollSpace);//保存滚动位置
	 })

	 $(function(){
		 var pageList = sessionStorage.getItem("fllow_page_list");
		 if(pageList!=null){
			 $("#newsList").html(pageList);
			 var hasNext = sessionStorage.getItem("fllow_has_next");
			 $("#hasNext").val(hasNext);
			 var offset = sessionStorage.getItem("fllow_offset_top");
			 $('#mescroll').scrollTop(offset);

			 $("#page").val(sessionStorage.getItem("fllow_page_index"));

			 if(sessionStorage.getItem("fllow_trace_type")>0){
				 $('#trace_type').val(sessionStorage.getItem("fllow_trace_type"));
			 }

			 if(sessionStorage.getItem("fllow_select_workerid")>0){
				 $('#select_workerid').val(sessionStorage.getItem("fllow_select_workerid"));
			 }

			 if(sessionStorage.getItem("fllow_keyword")!=''){
				 $('#type').val(sessionStorage.getItem("fllow_keyword"));
			 }

		 }else{
			 var page = $("#page").val();
			 getData(page);
		 }
	 });

	 // $(window).scroll(function(){
		//  hasNext = $("#hasNext").val();
		//  var height = $(window).height();
		//  var scrollSpace = $(window).scrollTop();
		//  if(scrollSpace>height){
		// 	 $('.backTop').fadeIn();
		//  }else{
		// 	 $('.backTop').fadeOut();
		//  }
		//  if (scrollSpace >= $(document).height() -  (height*1.2)){
		// 	 if (!loadingState && hasNext==1){
		// 		 loadingState = true;
		// 		 layer.msg('加载中', {
		// 			 icon: 16
		// 			 ,shade: 0.01
		// 		 });
		// 		 var page = $("#page").val();
		// 		 var next_page = +page+1;
		// 		 getData(next_page)
		// 	 }
		//  }
	 // })

	 function  getData(page, cb,isRefresh = false){
		 $("#page").val(page);
		 var select_workerid = {php echo $select_workerid?$select_workerid:0;};
		 var trace_type = {php echo $trace_type?$trace_type:1;};
		 var keyword = $("#keyword").val();
		 var op = $("#op").val();
		 var postUrl="/{php echo  createMobileUrl('main',array('themeid'=>$themeid,'mod'=> 'userdata'));}";
		 $.ajax({
			 url:postUrl,
			 dataType:'json',
			 method:'post',
			 data: {op:op,page:page,trace_type:trace_type,select_workerid:select_workerid,keyword:keyword},
			 success:function (e) {
				 let data = e.data.res_list;
				 let error = e.error;
				 let msg = e.msg;
				 if (error!=0){
					 layer.msg(msg);
				 }else{
					 var curPageData = data.curPageData;
					 var hasNext = data.hasNext;
					 setListData(curPageData, !isRefresh);
					 layer.closeAll();
					 if(cb && typeof cb === 'function') {
						 cb(curPageData.length, hasNext);
					 }
				 }
				 loadingState = false;
				 if (data.hasNext){
					 hasNext = 1;
				 }else{
					 hasNext = 0;
				 }

				 sessionStorage.setItem('fllow_page_index',page);
				 sessionStorage.setItem('fllow_loading_state',loadingState);
				 sessionStorage.setItem('fllow_has_next',hasNext);
				 setTimeout(() => {
					 sessionStorage.setItem('fllow_page_list',$('#newsList').html());
				 },200);
				 if(trace_type>0){
					 sessionStorage.setItem('fllow_trace_type',trace_type);
				 }else{
					 sessionStorage.removeItem('fllow_trace_type')
				 }
				 if(select_workerid>0){
					 sessionStorage.setItem('fllow_select_workerid',select_workerid);
				 }else{
					 sessionStorage.removeItem('fllow_select_workerid')
				 }
				 if(keyword>0){
					 sessionStorage.setItem('fllow_keyword',select_keyword);
				 }else{
					 sessionStorage.removeItem('fllow_keyword')
				 }
				 $("#hasNext").val(hasNext);

			 },
			 fail:function (err) {
				 console.log(err)
			 }
		 });
	 }

	 function typesNum(typesnum){
		 var typeNumStr = '';
		 for (var j = 0; j < typesnum.length; j++){
			 var newObj2=typesnum[j];
			 typeNumStr += `<span data-type="${newObj2.type}" >${newObj2.name}<i>${newObj2.num}</i></span>`
		 }
		 return typeNumStr;
	 }

	 function traceList(tracelist){
		 var traceStr = '<dl>';
		 for (var j = 0; j < tracelist.length; j++){
			 var newObj3=tracelist[j];
			 traceStr += `<dt style="display:${j>1?'none':'block'}"  >
									<div class="talkerImg">
										<img src="${newObj3.avatar}" onerror="javascript:this.src='https://css2020.yixuan.net/2020css/yx2020/images/question.png';">
									</div>
									<div class="talkerTxt">
										<h2>${newObj3.username}<span> ${newObj3.company_name?`${newObj3.company_name}`:''}   ${newObj3.team_name?`${newObj3.team_name}`:''}</span></h2>
										<b>${newObj3.create_time}</b>
										<p>${newObj3.content}</p>
									</div>
								</dt>`
		 }
		 traceStr+='</dl>';
		 traceStr+=tracelist.length>2?`<span class='openAll' onclick="openAll(this)" >展开全部</span>`:'';
		 return traceStr;
	 }

	 /*设置列表数据*/
	 function setListData(curPageData, isAppend) {
		 var listDom=document.getElementById("newsList");
		 if(isAppend) {
			 for (var i = 0; i < curPageData.length; i++) {
				 var newObj = curPageData[i];
				 var str = `
								<div class="fllowInfor">
									<div class="fllowUser">
										<div class="fllowerImg">
										  <a href="{php echo '/'.createMobileUrl('main',array('themeid'=>$themeid,'mod'=> 'userdata','op'=>'user_trace_list'));}&uid=${newObj.uid}">
											  <img src="${newObj.user_avater}" onerror="javascript:this.src='https://css2020.yixuan.net/2020css/yx2020/images/question.png';">
										  </a>
										</div>
										<p style="text-align: center">${newObj.user_username}</p>
									</div>
								<div class="floowTag">
									<h2>${newObj.user_nickname}</h2>
									<div class="tagList">
									  ${typesNum(newObj.typesnum)}
									</div>
								</div>
								<a href="tel:${newObj.user_mobile}" class="floowCall"></a>
							</div>
						  <div class='signTypeTag'>
								 ${newObj.sign_type > 0 ? `<span class="${newObj.sign_type == 1 ? 'unlabeledTag' : newObj.sign_type == 2 ? 'flowTag' : newObj.sign_type == 3 ? 'markTag' : 'payTag'}">${newObj.sign_name}</span>` : ' <span></span>'}
								 ${newObj.is_pay == 1 ? `<span class="payTag">已付</span>` : '<span></span>'}
						  </div>
							<div class="talkList">
								 ${traceList(newObj.trace_list)}
							</div>
							<div class="timesControl clearfix">
								<a href="">下次回访 </a>
								<p>${newObj.trace_next_time}</p>
								<div class="controlBar">
									<div class="controlList">
										<a  class="dateli" href='{php echo "/".createMobileUrl("main",array("themeid"=>$themeid,"mod"=>"userdata","op"=>"user_log_list"));}&uid=${newObj.uid}' >详情</a>
										<a href='{php echo "/".createMobileUrl("main",array("themeid"=>$themeid,"mod"=>"userdata","op"=>"user_trace_list"));}&uid=${newObj.uid}' class="fllow">追踪</a>
		<!--								<a href="#" class="shion">关系</a>-->
									</div>
									<i></i>
								</div>
						</div>`
				 var liDom = document.createElement("li");
				 liDom.innerHTML = str;
				 listDom.appendChild(liDom);//加在列表的后面,上拉加载
			 }
		 }else{
			 listDom.innerHTML = '';
			 for (var i = 0; i < curPageData.length; i++) {
				 var newObj = curPageData[i];
				 var str = `
								<div class="fllowInfor">
									<div class="fllowUser">
										<div class="fllowerImg">
										  <a href="{php echo '/'.createMobileUrl('main',array('themeid'=>$themeid,'mod'=> 'userdata','op'=>'user_trace_list'));}&uid=${newObj.uid}">
											  <img src="${newObj.user_avater}" onerror="javascript:this.src='https://css2020.yixuan.net/2020css/yx2020/images/question.png';">
										  </a>
										</div>
										<p style="text-align: center">${newObj.user_username}</p>
									</div>
								<div class="floowTag">
									<h2>${newObj.user_nickname}</h2>
									<div class="tagList">
									  ${typesNum(newObj.typesnum)}
									</div>
								</div>
								<a href="tel:${newObj.user_mobile}" class="floowCall"></a>
							</div>
						  <div class='signTypeTag'>
								 ${newObj.sign_type > 0 ? `<span class="${newObj.sign_type == 1 ? 'unlabeledTag' : newObj.sign_type == 2 ? 'flowTag' : newObj.sign_type == 3 ? 'markTag' : 'payTag'}">${newObj.sign_name}</span>` : ' <span></span>'}
								 ${newObj.is_pay == 1 ? `<span class="payTag">已付</span>` : '<span></span>'}
						  </div>
							<div class="talkList">
								 ${traceList(newObj.trace_list)}
							</div>
							<div class="timesControl clearfix">
								<a href="">下次回访 </a>
								<p>${newObj.trace_next_time}</p>
								<div class="controlBar">
									<div class="controlList">
										<a  class="dateli" href='{php echo "/".createMobileUrl("main",array("themeid"=>$themeid,"mod"=>"userdata","op"=>"user_log_list"));}&uid=${newObj.uid}' >详情</a>
										<a href='{php echo "/".createMobileUrl("main",array("themeid"=>$themeid,"mod"=>"userdata","op"=>"user_trace_list"));}&uid=${newObj.uid}' class="fllow">追踪</a>
		<!--								<a href="#" class="shion">关系</a>-->
									</div>
									<i></i>
								</div>
						</div>`
				 var liDom = document.createElement("li");
				 liDom.innerHTML = str;
				 listDom.insertBefore(liDom, listDom.firstChild);//加在列表的前面,下拉刷新
			 }
		 }
	}
	 // layui.use('form', function(){
		//  const form = layui.form;
		//  var op = $('#op').val();
		//  var select_workerid = {php echo $select_workerid?$select_workerid:0;};
	 //
		//  form.on('select', function (data) {
		// 	  location.href =  `/{php echo createMobileUrl('main',array('themeid'=>$themeid,'mod'=>'userdata'));}&op=${op}&select_workerid=${data.value}`;
		//  })
		//  $('#select_workerid').val(select_workerid)
		//  form.render();
	 // });

 </script>

{if $system['h5work'] == '1'}
{include file='fcworker/fc_foot'}
{else}
{include file='yxworker/w_foot'}
{/if}

